$(function () {
    $.ajax({
        type: "get",
        url: "./static/json/list.json",
        dataType: "json",
        success: function (r) {
            $(".smallimage").html(
                r.goods.map(item => {
                    return ` 
                            <div class="smallimage1">
                              
                                    <h4>${item.title}</h4>
                                    <p class="p1">${item.name}</p>
                                    <p class="p2">${item.price}</p>
                                    <div class="img"><img class="lazy" data-original="${item.image}">
                                    
                            </div>
                              
                        </a>`
                }
                )
            )
            $(".bigimage").html(
                r.lianjie.map(item => {
                    return ` 
                            <div class="bigimage">
                              
                                   <img class="lazy" data-original="${item.image}">
                            </div>
                              
                        </a>`
                }
                )
            )
            $(".bottomimage").html(
                r.biaozhi.map(item => {
                    return ` 
                            
                            <li class="bottomimage1">
                                    <img class="lazy" data-original="${item.image}" alt="">
                                    <em>${item.shu}</em>
                            </li>
                        
                              
                        </a>`
                }
                )
            )
            $(".cai3").html(
                r.list.map(item => {
                    return ` 
                            <div class="cai-cai-1">
                                    <div class="img"><img class="lazy" data-original="${item.image}">
                                    <h4>${item.title}</h4>
                                    <p class="p3">${item.name}</p>
                                    <p class="p4">${item.price}</p>
                                    
                            </div>
                              
                        </a>`
                }
                )
            )
            $("img.lazy").lazyload({ effect: "fadeIn", threshold: -300, placeholder: "" });
        },
        error: function (err) {
            console.log(1);
        }
    });

})